<template>
  <div id="app">
    <router-view></router-view>
  </div>
</template>

<script>

export default {
  name: "app",
  provide() {
    return {
      reload: this.reload
    };
  },
  data() {
    return {
      isRouterAlive: true
    };
  }
};
</script>

<style lang="scss">

html {
  background-color: #f8f8f8;
}
#app {
  font-family: "Avenir", Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  /* text-align: center; */
  color: #2c3e50;
  /* margin-top: 10px; */
  background-color: #f8f8f8;
}
.mtop{
  margin-top:10px;
}
.abs {
  position: absolute;
}
.cddd {
  color: #ddd;
}
.mt10 {
  margin-top: 10px;
}
.b {
  font-weight: bold;
}
.f14 {
  font-size: 14px;
}
.jcen {
  justify-content: center;
}
.acen {
  align-items: center;
}
.jeven {
  justify-content: space-evenly;
}
.bgfff {
  background-color: #fff;
}
.cen {
  text-align: center;
}
.logo {
  width: 18px;
  position: relative;
  top: -2px;
}
.m20 {
  margin: 20px;
}
.p20 {
  padding: 20px;
}
.bgdark {
  background-color: #13374d;
}

.fix {
  position: fixed;
}

.wp100 {
  width: 100%;
}

.row {
  display: flex;
  flex-direction: row;
}
.row1{
   display: flex;
  flex-direction: row;
}
.col {
  display: flex;
  flex-direction: column;
}

.ml20 {
  margin-left: 20px;
}

.mt20 {
  margin-top: 20px;
}

.ml5 {
  margin-left: 5px;
}

.ml10 {
  margin-left: 10px;
}

.mt5 {
  margin-top: 5px;
}

.pointer {
  cursor: pointer;
}

.vh80 {
  min-height: 80vh;
}

.cfff {
  color: #fff;
}

.cred {
  color: red;
}

.f18 {
  font-size: 18px;
}

.mt10 {
  margin-top: 10px;
}

.le1 {
  letter-spacing: 1px;
}
.tooltipsss {
  cursor: pointer;
  width: 5rem;
  height: 5rem;
}
.fwrap {
  flex-wrap: wrap;
}
.jcont {
  justify-content: center;
}

//liuyu
.fwrap {
  flex-wrap: wrap;
}

.b {
  font-weight: bold;
}

.cfff {
  color: #fff;
}

.bgfff {
  background-color: #fff;
}

@for $i from 1 through 6 {
  .ml#{$i*5} {
    margin-left: (5px * $i);
  }
}

@for $i from 1 through 101 {
  .wvw#{$i} {
    width: (1vw * $i);
  }
}

@for $i from 1 through 20 {
  .mlvw#{$i} {
    margin-left: (1vw * $i);
  }
}

@for $i from 1 through 4 {
  .le#{$i} {
    letter-spacing: (1px * $i);
  }
}

@for $i from 1 through 10 {
  .pt#{$i*5} {
    padding-top: (5px * $i);
  }
}
@for $i from 1 through 10 {
  .pb#{$i*5} {
    padding-bottom: (5px * $i);
  }
}

@for $i from 1 through 10 {
  .pl#{$i*5} {
    padding-left: (5px * $i);
  }
}

@for $i from 1 through 8 {
  .mt#{$i*5} {
    margin-top: (5px * $i);
  }
}

@for $i from 1 through 8 {
  .l#{$i*5} {
    left: (5px * $i);
  }
}

@for $i from 1 through 8 {
  .r#{$i*5} {
    right: (5px * $i);
  }
}
@for $i from 1 through 8 {
  .lh#{$i*5} {
    line-height: (5px * $i);
  }
}

.col {
  display: flex;
  flex-direction: column;
}

.acen {
  align-items: center;
}

.jcen {
  justify-content: center;
}

.row {
  display: flex;
  flex-direction: row;
}

.abs {
  position: absolute;
}
@for $i from 6 through 14 {
  .lh#{$i*10} {
    line-height: (10px * $i);
  }
}
@for $i from 12 through 120 {
  .f#{$i*1} {
    font-size: (1px * $i);
  }
}
@for $i from 60 through 120 {
  .h#{$i*1} {
    height: (1px * $i);
  }
}
.el-dialog__header .el-dialog__title {
  line-height: 24px;
  font-size: 18px;
  color: #fff;
}
.hover_row .cell {
  color: #fff;
}

</style>
